﻿@{
    Layout = "~/Views/Shared/_LayoutLogin.cshtml";

    ViewBag.Title = "登录";
}

<input id="ReturnURL" type ="hidden" value="@ViewBag.ReturnURL" />

<style type="text/css">
    #loading-mask {
        background-color: white;
        height: 100%;
        position: absolute;
        left: 0;
        top: 0;
        width: 100%;
        z-index: 20000;
    }

    #loading {
        height: auto;
        position: absolute;
        left: 45%;
        top: 40%;
        padding: 2px;
        z-index: 20001;
    }

    #loading .loading-indicator {
        background: white;
        color: #444;
        font: bold 13px Helvetica, Arial, sans-serif;
        height: auto;
        margin: 0;
        padding: 10px;
    }

    #loading-msg {
        font-size: 10px;
        font-weight: normal;
    }
</style>

<div id="loading-mask" style=""></div>
<div id="loading">
    <div class="loading-indicator">
        <img src="/Images/loader.gif" width="32" height="32" style="margin-right: 8px; float: left; vertical-align: top;" />
        欢迎使用PSI2014
        <br />
        <span id="loading-msg">加载中...</span>
    </div>
</div>

<script src="@Url.Content("~/ExtJS/ext-all.js")" type="text/javascript"></script>
<script src="@Url.Content("~/ExtJS/ext-lang-zh_CN.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/PSI/MsgBox.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/PSI/Const.js")" type="text/javascript"></script>
<script src="@Url.Content("~/ExtJS/Center.js")" type="text/javascript"></script>
<link href="@Url.Content("~/ExtJS/resources/css/ext-all.css") " rel="stylesheet" type="text/css"/>
<link href="@Url.Content("~/Content/site.css") " rel="stylesheet" type="text/css"/>
<link href="@Url.Content("~/Content/icons.css") " rel="stylesheet" type="text/css"/>

<script type="text/javascript">
    Ext.onReady(function () {
        Ext.QuickTips.init();

        var formSubmitHandler = function () {
            vp.focus();
            vp.getEl().mask("正在登录，请稍等...");

            Ext.getCmp("loginForm").getForm().submit({
                url: "/User/LoginPOST",
                method: "POST",
                success: function (form, action) {
                    Ext.util.Cookies.set("psi_user_login_name", encodeURIComponent(userName.getValue()),
                    Ext.Date.add(new Date(), Ext.Date.YEAR, 1));
                    
                    var returnURL = document.getElementById("ReturnURL").value;
                    if (returnURL) {
                        location.replace(returnURL);
                    } else {
                        location.replace("/");
                    }
                },
                failure: function (form, action) {
                    vp.getEl().unmask();
                    PSI.MsgBox.showInfo(action.result.msg, function () {
                        var input = vp.getComponent(0).getComponent(1);
                        input.setValue("");
                        input.focus();
                    });
                }
            });
        };

        var loginForm = {
            id: "loginForm",
            width: 400,
            height: "20%",
            layout: "form",
            xtype: "form",
            defaultType: 'textfield',
            border: false,
            header: false,
            fieldDefaults: {
                labelWidth: 70,
                labelAlign: "right",
                labelSeparator: "",
                msgTarget: 'side'
            },
            items: [
                    {
                        id: "editLoginName",
                        fieldLabel: "用户名",
                        allowBlank: false,
                        blankText: "没有输入用户名",
                        beforeLabelTextTpl: PSI.Const.REQUIRED,
                        name: "LoginName"
                    },
                    {
                        id: "editPassword",
                        fieldLabel: "密码",
                        allowBlank: false,
                        blankText: "没有输入密码",
                        beforeLabelTextTpl: PSI.Const.REQUIRED,
                        inputType: "password",
                        name: "Password"
                    }
            ],
            buttons: [
                {
                    text: "登录",
                    formBind: true,
                    handler: formSubmitHandler,
                    iconCls: "psi-button-ok"
                }
            ]
        };

        var vp = Ext.create("Ext.Viewport", {
            layout: "ux.center",
            items: [loginForm]
        });

        var userName = Ext.getCmp("editLoginName");
        var lastLoginName = Ext.util.Cookies.get("psi_user_login_name");
        if (lastLoginName) {
            userName.setValue(decodeURIComponent(lastLoginName));
        }

        var password = Ext.getCmp("editPassword");
        if (userName.getValue()) {
            password.focus();
        } else {
            userName.focus();
        }

        userName.on("specialkey", function (field, e) {
            if (e.getKey() == e.ENTER) {
                password.focus();
            }
        });
        password.on("specialkey", function (field, e) {
            if (e.getKey() == e.ENTER) {
                if (Ext.getCmp("loginForm").getForm().isValid()) {
                    formSubmitHandler();
                }
            }
        });

        Ext.get("loading").remove();
        Ext.get("loading-mask").remove();
    });
</script>

